/**
 * @intro:
 * @param {type}
 * @return:
 * @Date: 2019-05-16 14:29:23
 */
import React, { Component } from 'react';
import { Link } from 'react-router-dom'
import PageTitle from '../../components/page-title';
import MUtil from '../../utils/mm';
import Order from '../../service/order-service';

import Pagination from '../../utils/pagination'
import TableList from '../../utils/tableList'
import ListSearch from './index-list-search'


const _mm = new MUtil()
const _order = new Order();

class OrderList extends Component {
	constructor(props) {
		super(props);
		this.state = {
			currentPage: 1,
			list: [],
			listType: 'list',
			orderNumber: ''
		 };
	}

	componentDidMount() {
		this.loadOrderList()
	}

	// 获取列表数据
	loadOrderList() {
		let listParam = {};
		listParam.listType = this.state.listType
		listParam.pageNum = this.state.currentPage
		// 如果是搜索类型的话需要传入值
		if(this.state.listType === 'search') {
			listParam.orderNo = this.state.orderNumber
		}

		_order.getOrderList(listParam).then(res=>{
			this.setState(res)
		},errMsg=>{
			this.setState({
				list: []
			});
			_mm.errorTips(errMsg)
		})
	}

	// 页数发生变化
	onPageNumChange(pageNum) {
		this.setState({
			currentPage: pageNum
		}, () => {
			this.loadOrderList()
		})
	}

	// 搜索
	onSearch(orderNumber) {
		let listType = orderNumber === ''? 'list':'search'
		this.setState({
			listType: listType,
			currentPage: 1,
			orderNumber: orderNumber
		},() => {
			// 放到回调里边
			this.loadOrderList()
		})
	}

	render() {
		let tableHeads = ['订单号','收件人','订单状态','订单总价','创建时间','操作']

		return (
			<div id="page-wrapper">
				<PageTitle title="订单管理" />
				<ListSearch
					onSearch={
						(orderNumber) => {
							this.onSearch(orderNumber)
						}
					}
				/>
				<TableList tableHeads={tableHeads}>
					{
						this.state.list.map((order,index) => {
							return (
								<tr key={index}>
									<td><Link className="opear" to={`/order/detail/${order.orderNo}`}>{order.orderNo}</Link></td>
									<td>{order.receiverName}</td>
									<td>{order.statusDesc}</td>
									<td>￥{order.payment}</td>
									<td>{order.createTime}</td>
									<td>
										<Link className="opear" to={`/order/detail/${order.orderNo}`}>详情</Link>
									</td>
								</tr>
							)
						})
					}
				</TableList>
				<Pagination
					current={this.state.currentPage}
					total={this.state.total}
					onChange={(pageNum)=>this.onPageNumChange(pageNum)}
					showQuickJumper={true}
				/>
			</div>
		);
	}
}

export default OrderList;
